<template>
  <div
    id="regSet"
    class="setting-box regSet p-2.5"
    :class="treeStore.isShowStrategyDetail ? 'not-click' : ''"
    v-loading="loading"
  >
    <div class="topband">注册表防护设置</div>
    <div class="titleMargin">
      <div class="leftCont">防护状态</div>
      <div class="leftCont">
        <el-switch
          v-model="data.regState"
          active-value="1"
          inactive-value="0"
          @click="setRegProtectStatus"
          style="margin-right: 10px"
        >
        </el-switch>
        <el-tooltip effect="dark" content="开启或关闭注册表防护" placement="right">
          <el-icon><QuestionFilled /></el-icon>
        </el-tooltip>
      </div>
    </div>
  </div>
</template>

<script setup>
import { ref, reactive, onMounted, watch } from "vue";
import { useTreeStore } from "~/utils/pinia/tree.js";
import { req_getRegProtectStatus, req_setRegProtectStatus } from "~/utils/axios/index.js";
import { ElMessage } from "element-plus";
import { QuestionFilled } from "@element-plus/icons-vue";
import { _debounce } from "~/utils/common/function.js";
import { eventBus } from "~/utils/common/eventBus.js";
eventBus.on("getStrategyDetail", (detail) => {
  data.regState = detail.data[0].regmon;
});
const treeStore = useTreeStore();
const loading = ref(false);
const data = reactive({
  regState: "",
});
onMounted(() => {
  getRegProtectStatus();
});
watch(
  () => treeStore.treeDeviceId,
  () => {
    getRegProtectStatus();
  }
);
const getRegProtectStatus = () => {
  if (!treeStore.treeDeviceId) return;
  loading.value = true;
  data.regState = "";
  let params = ["regmon"];
  req_getRegProtectStatus(treeStore.treeDeviceId, params)
    .then((res) => {
      loading.value = false;
      data.regState = res.data.data[0].regmon || "";
    })
    .catch((err) => {
      loading.value = false;
    });
};
const setRegProtectStatus = _debounce(() => {
  if (!treeStore.treeDeviceId) return;
  let params = [
    {
      key: "regmon",
      value: data.regState,
    },
  ];
  req_setRegProtectStatus(treeStore.treeDeviceId, params).then((res) => {
    res.data.succeed ? ElMessage.success("设置成功") : ElMessage.error("设置失败");
    getRegProtectStatus();
  });
}, 500);
</script>

<style lang="scss" scoped>
.regSet {
  background-color: #fff;
  padding-bottom: 20px;
  margin-top: -11px;
}

.titleMargin,
.leftCont {
  display: flex;
  align-items: center;
}
.titleMargin {
  padding: 10px 0 0 65px;
}
.leftCont {
  margin-right: 20px;
  font-size: 16px;
}
</style>
